const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const CompressionWebpackPlugin = require('compression-webpack-plugin')
const resolve = dir => path.resolve(__dirname, dir)
const productionGzipExtensions = ['js', 'css']

module.exports = {
    /* 输出文件目录：在npm run build时，生成文件的目录名称 */
    outputDir: "dist",
    /* 放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录 */
    assetsDir: "assets",
    /* 是否在构建生产包时生成 sourceMap 文件，false将提高构建速度 */
    productionSourceMap: false,
    /* 代码保存时进行eslint检测 */
    lintOnSave: false,
    /* webpack-dev-server 相关配置 */
    devServer: {
        /* 自动打开浏览器 */
        open: true,
    },
    chainWebpack: config => {
        // 全局使用scss变量
        const oneOfsMap = config.module.rule('scss').oneOfs.store
        oneOfsMap.forEach(item => {
            item.use('sass-resources-loader').loader('sass-resources-loader').options({
                resources: resolve('element-variables.scss'),
            }).end()
        })
        config.optimization.splitChunks({
            chunks: 'all',
            cacheGroups: {
                libs: {
                    name: 'chunk-libs',
                    test: /[\\/]node_modules[\\/]/,
                    priority: 10,
                    chunks: 'initial' // 只打包最初依赖的第三方
                },
                elementUI: {
                    name: 'chunk-elementUI', // 将 elementUI 拆分为一个包
                    priority: 20, // 权重需要大于libs和app，否则会打包成libs或app
                    test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // 为了适应cnpm
                },
                commons: {
                    name: 'chunk-commons',
                    test: resolve('src/components'), // 可以自定义你的规则
                    minChunks: 3,   
                    priority: 5,
                    reuseExistingChunk: true
                }
            }
        })
        config.optimization.runtimeChunk('single')
        config.plugin('html').tap(args => {
            args[0].title = 'JoyDigGit CMS'
            return args;
        })
    },
    configureWebpack: config => {
        if (process.env.NODE_ENV === 'production') {
            config.output = {
                path: resolve('./dist'),
                filename: '[name].[chunkhash:8].js',
                publicPath: '/',
                chunkFilename: 'static/js/[name].[chunkhash:8].js'
            }
        }

        const pluginsList = [
            new CopyWebpackPlugin({
                patterns: [
                    {
                        from: resolve('static'),
                        to: 'static',
                        globOptions: {
                            ignore: ['.*']
                        }
                    }
                ]
            }),
            // 配置压缩
            new CompressionWebpackPlugin({
                algorithm: 'gzip',
                test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
                threshold: 10240,
                minRatio: 0.8
            }),
        ]
        pluginsList.forEach(item => {
            config.plugins.push(item);
        });
    }
}